
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
        <title>什亭之匣操作系统 | SCHALE</title>
            <style>
                    :root {
                                    --main-blue: #2A4F9D;
                                                --accent-gold: #FFD700;
                                                            --terminal-green: #00FF7F;
                    }

                            body {
                                            background: radial-gradient(circle at center, #0A1A3A, #000913);
                                                        color: white;
                                                                    font-family: 'Segoe UI', 'Noto Sans SC', sans-serif;
                                                                                margin: 0;
                                                                                            min-height: 100vh;
                                                                                                        position: relative;
                            }

                                    .container {
                                                    display: grid;
                                                                grid-template-rows: 80px 1fr 50px;
                                                                            height: 100vh;
                                                                                        padding: 20px;
                                    }

                                            /*顶部状态栏*/
                                                    .status-bar {
                                                                    display: flex;
                                                                                justify-content: space-between;
                                                                                            align-items: center;
                                                                                                        padding: 0 30px;
                                                                                                                    background: rgba(42, 79, 157, 0.8);
                                                                                                                                border-radius: 15px;
                                                                                                                                            margin-bottom: 20px;
                                                                                                                                                        box-shadow: 0 0 15px var(--main-blue);
                                                    }

                                                            /*阿洛娜形象区域*/
                                                                    .arona-section {
                                                                                    position: relative;
                                                                                                background: linear-gradient(45deg, #1A2C4E 0%, #0F1A2D 100%);
                                                                                                            border: 3px solid var(--accent-gold);
                                                                                                                        border-radius: 20px;
                                                                                                                                    overflow: hidden;
                                                                    }

                                                                            .arona-image {
                                                                                            position: absolute;
                                                                                                        right: -50px;
                                                                                                                    bottom: -30px;
                                                                                                                                width: 400px;
                                                                                                                                            filter: drop-shadow(0 0 20px var(--terminal-green));
                                                                                                                                                        transition: transform 0.3s;
                                                                            }

                                                                                    /*主功能网格*/
                                                                                            .grid-system {
                                                                                                            display: grid;
                                                                                                                        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
                                                                                                                                    gap: 15px;
                                                                                                                                                padding: 20px;
                                                                                            }

                                                                                                    .grid-item {
                                                                                                                    background: rgba(42, 79, 157, 0.6);
                                                                                                                                border: 2px solid var(--accent-gold);
                                                                                                                                            border-radius: 12px;
                                                                                                                                                        padding: 15px;
                                                                                                                                                                    text-align: center;
                                                                                                                                                                                cursor: pointer;
                                                                                                                                                                                            transition: all 0.3s;
                                                                                                    }

                                                                                                            .grid-item:hover {
                                                                                                                            transform: translateY(-5px);
                                                                                                                                        background: rgba(0, 255, 127, 0.2);
                                                                                                                                                    box-shadow: 0 0 15px var(--terminal-green);
                                                                                                            }

                                                                                                                    /*动态特效*/
                                                                                                                            .scan-line {
                                                                                                                                            position: fixed;
                                                                                                                                                        top: 0;
                                                                                                                                                                    left: 0;
                                                                                                                                                                                width: 100%;
                                                                                                                                                                                            height: 100%;
                                                                                                                                                                                                        background: repeating-linear-gradient(
                                                                                                                                                                                                                            0deg,
                                                                                                                                                                                                                                            rgba(0, 255, 127, 0.05) 0px,
                                                                                                                                                                                                                                                            rgba(0, 255, 127, 0.05) 2px,
                                                                                                                                                                                                                                                                            transparent 2px,
                                                                                                                                                                                                                                                                                            transparent 4px
                                                                                                                                                                                                        );
                                                                                                                                                                                                                    pointer-events: none;
                                                                                                                                                                                                                                z-index: 999;
                                                                                                                            }

                                                                                                                                    @keyframes pulse {
                                                                                                                                                    0% { opacity: 0.3; }
                                                                                                                                                                50% { opacity: 0.7; }
                                                                                                                                                                            100% { opacity: 0.3; }
                                                                                                                                    }
                                                                                                                                        </style>
                                                                                                                                        <meta name="viewport" content="width=device-width, initial-scale=1"></head>
                                                                                                                                        <body>
                                                                                                                                            <div class="scan-line"></div>
                                                                                                                                                
                                                                                                                                                    <div class="container">
                                                                                                                                                            <!-- 顶部状态栏 -->
                                                                                                                                                                    <div class="status-bar">
                                                                                                                                                                                <div>SCHALE OS v0.97.3 ███████░░░░ 73%</div>
                                                                                                                                                                                            <div>奇普托斯标准时间 21:47</div>
                                                                                                                                                                                                        <div>阿洛娜AI核心温度 42℃</div>
                                                                                                                                                                                                                </div>

                                                                                                                                                                                                                        <!-- 主内容区 -->
                                                                                                                                                                                                                                <main class="arona-section">
                                                                                                                                                                                                                                            <!-- 功能网格系统 -->
                                                                                                                                                                                                                                                        <div class="grid-system">
                                                                                                                                                                                                                                                                        <div class="grid-item">学生档案</div>
                                                                                                                                                                                                                                                                                        <div class="grid-item">战术对抗赛</div>
                                                                                                                                                                                                                                                                                                        <div class="grid-item">基沃托斯地图</div>
                                                                                                                                                                                                                                                                                                                        <div class="grid-item">什亭军备库</div>
                                                                                                                                                                                                                                                                                                                                        <div class="grid-item">特别委托</div>
                                                                                                                                                                                                                                                                                                                                                        <div class="grid-item">阿洛娜商店</div>
                                                                                                                                                                                                                                                                                                                                                                        <div class="grid-item">联邦理事会</div>
                                                                                                                                                                                                                                                                                                                                                                                        <div class="grid-item">紧急通讯</div>
                                                                                                                                                                                                                                                                                                                                                                                                    </div>
                                                                                                                                                                                                                                                                                                                                                                                                                
                                                                                                                                                                                                                                                                                                                                                                                                                            <!-- 阿洛娜动态形象 -->
                                                                                                                                                                                                                                                                                                                                                                                                                                        <img src="https://cdn.rthe.cn/cached-d41d8cd98f00b204e9800998ecf8427e-avif/bci/arona.png" class="arona-image" alt="阿洛娜形象">
                                                                                                                                                                                                                                                                                                                                                                                                                                                </main>

                                                                                                                                                                                                                                                                                                                                                                                                                                                        <!-- 底部状态栏 -->
                                                                                                                                                                                                                                                                                                                                                                                                                                                                <div class="status-bar" style="margin-top: 20px;">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                            <div>当前连接：沙勒战术指挥中心</div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <div>奇普托斯网络状态：<span style="color: var(--terminal-green);">■ 稳定</span></div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <div>电力储备：84%</div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </div>

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    <script>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            // 悬浮特效
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    document.querySelectorAll('.grid-item').forEach(item => {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    item.addEventListener('mouseover', () => {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        item.style.transform = 'scale(1.05)';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        item.style.background = 'rgba(0, 255, 127, 0.3)';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    });
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                item.addEventListener('mouseout', () => {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    item.style.transform = 'scale(1)';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    item.style.background = 'rgba(42, 79, 157, 0.6)';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                });
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    });

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            // 状态栏动态更新
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    function updateStatus() {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    const timeElement = document.querySelector('.status-bar div:nth-child(2)');
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                const now = new Date();
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            timeElement.textContent = `奇普托斯标准时间 ${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}`;

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        const tempElement = document.querySelector('.status-bar div:nth-child(3)');
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    const temp = 42 + Math.random() * 2;
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                tempElement.textContent = `阿洛娜AI核心温度 ${temp.toFixed(1)}℃`;
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            setInterval(updateStatus, 5000);
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </script>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </body>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </html>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                })
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    })
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    })
                                                                                                                                    }
                                                                                                                                                                                                        )
                                                                                                                            }
                                                                                                            }
                                                                                                    }
                                                                                            }
                                                                            }
                                                                    }
                                                    }
                                    }
                            }
                    }